@extends('common.layouts.public')

@section('top')
<div>
	<iframe width="100%" height="400" src="//www.youtube.com/embed/NxWbK_0JBzM?rel=0" frameborder="0" allowfullscreen></iframe>
	<div class="ui page grid">
		<div class="twelve wide column">
			<div class="ui massive black buttons">
				<a class="ui animated green button" href="{{ url('/auth/signup') }}">
					<div class="visible content">Sign Up</div>
					<div class="hidden content">
						<i class="angle up icon"></i>
					</div>
				</a>
				<a class="ui animated button" href="{{ url('/auth') }}">
					<div class="visible content">Sign In</div>
					<div class="hidden content">
						<i class="angle right icon"></i>
					</div>
				</a>
				<a class="ui animated button" href="#more">
					<div class="visible content">More</div>
					<div class="hidden content">
						<i class="angle down icon"></i>
					</div>
				</a>
			</div>
		</div>
		<div class="four wide column" style="text-align:right">
			<small>CREDITS</small>
			<div>/Director: <b>Ralitza Stefanova</b></div>
			<div>/Operator: <b>Rosen Savkov</b></div>
			<div>/Producer: <b>Ivo Nikolov</b></div>
		</div>
	</div>
</div>
@stop

@section('content')
<h1 class="row">Pricing Plans</h1>
<div class="ui center aligned four column celled grid">
	<div class="row">
		<div class="column"></div>
		@foreach(['Free', 'Professional', 'Enterprise'] as $plan)
		<div class="column">
			<a class="ui animated green fluid button" href="{{ url('/auth/signup') }}">
				<div class="visible content">{{ $plan }}</div>
				<div class="hidden content">
					<i class="ui right arrow icon"></i>
					Subscribe
				</div>
			</a>
		</div>
		@endforeach
	</div>
	
	@for($a=1;$a<5;$a++)
	<div class="row">
		<div class="column">Feature {{ $a }}</div>
		<div class="column"><i class="red delete icon"></i></div>
		<div class="column"><i class="{{ $a<2 ? 'green check' : 'red delete' }} icon"></i></div>
		<div class="column"><i class="green check icon"></i></div>
	</div>
	@endfor
	
	<div class="row">
		<div class="column">Monthly Charge</div>
		<div class="column">Free</div>
		<div class="column">50 &euro;</div>
		<div class="column">100 &euro;</div>
	</div>
</div>
@stop